<%--
  Created by IntelliJ IDEA.
  User: CZH1
  Date: 2020/11/29
  Time: 16:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Detail</title>
    <style>
        .d1 table tr td{
            font-size: 13px;
        }
        .d1 table tr td a{
            text-decoration: none;
        }
        *{
            margin: 0 auto;
            padding: 0;
        }
        * {
            margin: 0 auto;
            padding: 0;
        }
        #ul1 li{
            list-style: none;
            float: left;
            margin-left: 26px;
            color: #FFFFFF;
            font-size: 13px;
        }
        #ul1 li a{
            color: #ffffff;
            text-decoration: none;
        }
        #ul1 li a:hover{
            color: #FFFF00;
        }

    </style>
    <script>
        function aa(bb){
            var num1=Number(document.getElementById('result').value);
            var num2=1;
            var s=result;
            switch(bb){
                case'+':s=num1+num2;break;
                case'-':s=num1-num2;break;
            }
            if(s < 1){
                s=1
            }
            document.getElementById('result').value=s;

        }
    </script>
</head>
<body>
<%--<iframe src="${pageContext.request.contextPath}/Top.jsp" style="width: 100%;height: 160px;border: 0px"></iframe>--%>

<div>
    <%--第一部分--%>
    <div style="width: 100%;height: 34px;background-color: #efefef">
        <div style="text-align:right;font-size: 14px;line-height: 34px;width: 1000px;padding-right: 20px">
            官方网站<a href="https://www.gec.com">https://www.gec.com</a>
            [<a href="http://localhost:8080/${pageContext.request.contextPath}/login.jsp">${user.name}</a>]

            [<a href="http://localhost:8080/${pageContext.request.contextPath}/informationListServlet">我的购物车</a>]
            [<a href="http://localhost:8080/${pageContext.request.contextPath}/orderForm.jsp">我的订单</a>]
            <a href="#">设置为首页</a>
            |<a href="#">加入收藏</a>
        </div>
    </div>

    <%--第二部分--%>
    <div>
        <div style="width: 1000px;margin-top: 20px">
            <table>
                <tr>
                    <td><img src="img/article/logo.gif"></td>
                    <td><img src="img/banner.gif"></td>
                    <td><a href="#" style="border:1px solid #CCCCCC;text-decoration: none;color: #CCCCCC;font-size: 12px">&nbsp;&nbsp;关于我们&nbsp;&nbsp;</a><br><br><a href="#" style="border:1px solid #CCCCCC;text-decoration: none;color: #CCCCCC;font-size: 12px">&nbsp;&nbsp;联系方式&nbsp;&nbsp;</a></td>
                </tr>
            </table>
        </div>
    </div>

    <%--第三部分--%>
    <div style="width: 100%;height: 30px;background-color: #CC3333;margin-top: 20px">
        <div style="width: 1000px;line-height: 30px;text-align: center">
            <ul id="ul1">
                <li><a href="index.do"target="_blank">首页</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0001">护肤</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0002">彩妆</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0003">香氛</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0004">身体护理</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0005">礼盒套装</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0006">母婴专区</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0007">男士专区</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0008">粉底</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0009">粉饼</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0010">睫毛膏</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0011">唇彩</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0012">腮红</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0013">食品保健</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0014">瘦身类</a></li>
                <li><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0015">美容类</a></li>
            </ul>
        </div>
    </div>
</div>

<div style="width: 1500px;position: relative">
    <div style="margin-left: 200px;width:263px;border: 1px solid #F6A65B; background: #F6A65B;position: absolute" align="center" class="d1">
        <table bgcolor="#F6A65B" width="264px" height="550px" style="margin: 0px">
            <tr>
                <td style="font-size: 20px;color: #6E3D12">物品分类</td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0001">&nbsp;护肤</a> <span style="margin-left: 200px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0002">&nbsp;彩妆</a><span style="margin-left: 200px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0003">&nbsp;香氛</a> <span style="margin-left: 200px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0004">&nbsp;身体护理</a> <span style="margin-left: 174px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0005">&nbsp;礼盒套装</a> <span style="margin-left: 174px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0006">&nbsp;母婴专区</a> <span style="margin-left: 174px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0007">&nbsp;男士专区</a> <span style="margin-left: 174px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0008">&nbsp;粉底</a> <span style="margin-left: 200px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0009">&nbsp;粉饼</a> <span style="margin-left: 200px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0010">&nbsp;睫毛膏</a> <span style="margin-left: 187px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0011">&nbsp;唇彩</a> <span style="margin-left: 200px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0012">&nbsp;腮红</a> <span style="margin-left: 200px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0013">&nbsp;食品保健</a> <span style="margin-left: 174px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0014">&nbsp;瘦身类</a> <span style="margin-left: 187px;color: #F5D79C"> ></span></td>
            </tr>
            <tr>
                <td bgcolor="#FFFFFF"><a href="http://localhost:8080/${pageContext.request.contextPath}/index.do?type_code=0015">&nbsp;美容类</a> <span style="margin-left: 187px;color: #F5D79C"> ></span></td>
            </tr>
        </table>
    </div>

    <div style="margin-left: 480px;width: 900px;height:600px;position: absolute" >
        <div style="height: 40px" align="center">
            <span name="">${article.title}</span>
        </div>
        <div style="margin-left:0px;width: 350px;height: 550px;position: absolute" align="center">
            <img src="${pageContext.request.contextPath}/img/article/${article.image}" name="IMAGE" height="350px" width="350px" border="1px solid #EDEDED">
            <span style="font-size: 13px">评分:<span style="color: #FDD81A">★★★★★</span> <a href="#">(已有151人评价)</a><br></span>
            <span style="font-size: 13px"> <a href="#">该商品支持全国购买</a></span>
        </div>
        <div style="margin-left:380px;width: 520px;height: 550px;position: absolute;">
            <table width="520px" height="250px" style="font-size: 14px">

                <tr>
                    <td>供应商： <span style="font-weight: bold" name="">${article.supplier}</span></td>
                </tr>
                <tr>
                    <td>出产地： <span style="font-weight: bold;" name="">${article.locality}</span><br>&nbsp;</td>
                </tr>
                <tr>
                    <td>定&nbsp;&nbsp;&nbsp;价： <span name="">${article.price}</span></td>
                </tr>
                <tr>
                    <td>疯狂价： <span style="color: #F14A4A;" name="">${String.format("%.2f",article.discount*article.price)}(0.7折)</span><br></td>
                </tr>
                <tr>
                    <td style="color: #686766" name="">库&nbsp;&nbsp;&nbsp;存：${article.storage}<span style="color: #686766">下单后立即发货</span><br></td>
                </tr>
                <tr>
                    <td>促销信息： <span style="color: #F14A4A;">该商品参加满减活动，购买活动商品每满300，可减100元现金</span><br></td>
                </tr>
            </table>
            <form action="${pageContext.request.contextPath}/addInformationServlet" method="post">
                <table border="1px solid #F4E6A6" height="150px" width="525px" cellpadding="0" cellspacing="0" style="background-color: #FFFCEB">
                    <!--  隐藏域 提交-->
                    <c:set value="00020001" var="typeCode"/>
                    <input type="hidden" name="DISCOUNT" value="${article.discount}">
                    <input type="hidden" name="TITLE" value="${article.title}">
                    <input type="hidden" name="PRICE" value="${article.price}">
                    <input type="hidden" name="supplier" value="${article.supplier}">
                    <input type="hidden" name="IMAGE" value="${article.image}">
                    <input type="hidden" name="TYPECODE" value="${typeCode}">
                    <tr>
                        <td rowspan="2" style="border: 1px solid #F4E6A6">&nbsp;&nbsp;&nbsp;我要买：
                            <button type="button" style="height: 15px;width: 15px;line-height: 10px" onclick="aa('-')">-</button>
                            <input id="result" type="text" style="width: 30px;text-align: center" name="BUYNUM" value="1">
                            <button type="button" style="height: 15px;width: 15px;line-height: 10px" onclick="aa('+')">+</button>
                        </td>
                    </tr>
                    <tr></tr>
                    <tr>
                        <td rowspan="3" style="border: 1px solid #F4E6A6">&nbsp;&nbsp;&nbsp;&nbsp;
                            <a href="">
                                <button style="border: 0px" type="submit"><img src="${pageContext.request.contextPath}/img/addingcar.jpg" width="180px"></button>&nbsp;&nbsp;
                            </a>
                            <button style="border: 0px"><img src="${pageContext.request.contextPath}/img/btn_attention.jpg" width="80px"></button>
                        </td>
                    </tr>
                    <tr></tr>
                    <tr></tr>
                </table>
            </form>

        </div>
    </div>

</div>
</body>
</html>
